template(name="swimlaneHeader")
  .swimlane-header-wrap.js-swimlane-header(class=colorClass title="{{_ 'rename'}}")
    if this.isTemplateContainer
        +swimlaneFixedHeader(this)
    else
      +inlinedForm
        +editSwimlaneTitleForm
      else
        +swimlaneFixedHeader(this)

template(name="swimlaneFixedHeader")
  .swimlane-header(
    class="{{#if currentUser.isBoardMember}}js-open-inlined-form is-editable{{/if}}")
      if $eq title 'Card Templates'
        | {{_ 'card-templates-swimlane'}}
      else if $eq title 'List Templates'
        | {{_ 'list-templates-swimlane'}}
      else if $eq title 'Board Templates'
        | {{_ 'board-templates-swimlane'}}
      else if $eq title 'Default'
        | {{_ 'defaultdefault'}}
      else
        +viewer
          | {{isTitleDefault title}}
  .swimlane-header-menu
    if currentUser
      unless currentUser.isCommentOnly
        unless currentUser.isWorker
          a.js-open-add-swimlane-menu.swimlane-header-plus-icon(title="{{_ 'add-swimlane'}}")
            | ➕
          a.js-open-swimlane-menu(title="{{_ 'swimlaneActionPopup-title'}}")
            | ☰
          //// TODO: Collapse Swimlane: make button working, etc.
          //unless collapsed
          //  a.js-collapse-swimlane(title="{{_ 'collapse'}}")
          //    i.fa.fa-arrow-down.swimlane-header-collapse-down
          //    ⬆️.swimlane-header-collapse-up
          //if collapsed
          //  a.js-collapse-swimlane(title="{{_ 'uncollapse'}}")
          //    ⬆️.swimlane-header-collapse-up
          //    i.fa.fa-arrow-down.swimlane-header-collapse-down
          unless isTouchScreen
            a.swimlane-header-handle.handle.js-swimlane-header-handle
              | ↕️
          if isTouchScreen
            a.swimlane-header-miniscreen-handle.handle.js-swimlane-header-handle
              | ↕️

template(name="editSwimlaneTitleForm")
  .list-composer
    input.list-name-input.full-line(type="text" value="{{isTitleDefault title}}" autofocus)
    .edit-controls.clearfix
      button.primary.confirm(type="submit") {{_ 'save'}}
      a.js-close-inlined-form
        | ❌

template(name="swimlaneActionPopup")
  if currentUser
    unless currentUser.isCommentOnly
      ul.pop-over-list
         if currentUser.isBoardAdmin
           li: a.js-set-swimlane-color
             | 🎨
             | {{_ 'select-color'}}
         li: a.js-set-swimlane-height
           | ↕️
           |  {{_ 'set-swimlane-height'}}
      if currentUser.isBoardAdmin
        unless this.isTemplateContainer
          hr
          ul.pop-over-list
            li: a.js-close-swimlane
              | ▶️
              | 📦
              | {{_ 'archive-swimlane'}}
          ul.pop-over-list
            li: a.js-copy-swimlane
              | 📋
              | {{_ 'copy-swimlane'}}
          ul.pop-over-list
            li: a.js-move-swimlane
              | ⬆️
              | {{_ 'move-swimlane'}}

template(name="swimlaneAddPopup")
  if currentUser
    unless currentUser.isCommentOnly
      form
        input.swimlane-name-input.full-line(type="text" placeholder="{{_ 'add-swimlane'}}"
          autocomplete="off" autofocus)
        .edit-controls.clearfix
          button.primary.confirm(type="submit") {{_ 'add'}}
          unless currentBoard.isTemplatesBoard
            unless currentBoard.isTemplateBoard
              span.quiet
                | {{_ 'or'}}
                a.js-swimlane-template {{_ 'template'}}

template(name="setSwimlaneColorPopup")
  form.edit-label.swimlane-color-popup
    // Align content to left and remove default gutter
    .flush-left
      .palette-colors(style="margin-left:0; padding-left:0; justify-content:flex-start;")
        each colors
          span.card-label.palette-color.js-palette-color(class="card-details-{{color}}")
            if(isSelected color)
              | ✅
    // Buttons aligned left too
    .flush-left
      button.primary.confirm.js-submit(style="margin-left:0") {{_ 'save'}}
      button.js-remove-color.negate.wide.right(style="margin-left:8px") {{_ 'unset-color'}}

template(name="setSwimlaneHeightPopup")
  .flush-left.swimlane-height-popup
    #js-swimlane-height-edit
      label a) {{_ 'set-swimlane-height-value'}}
      label b) -1
        p
          input.swimlane-height-value(type="number" value="{{ swimlaneHeightValue }}" min="100")
          input.swimlane-height-apply(type="submit" value="{{_ 'apply'}}")
          input.swimlane-height-error

template(name="swimlaneHeightErrorPopup")
  .swimlane-height-invalid
    p {{_ 'swimlane-height-error-message'}} '&gt;=100'
    button.full.js-back-view(type="submit") {{_ 'cancel'}}

template(name="swimlaneDeletePopup")
  p {{_ "swimlane-delete-pop"}}
  button.js-confirm.negate.full(type="submit") {{_ 'delete'}}
